import { RouteComponentProps, Link, withRouter } from "react-router-dom";
import { Breadcrumb } from "antd";
import React from "react";
import './RouterBread.less'

export let breadcrumbNameMap: {
    [propname: string]: {
        label?: string,
        hasChild: boolean
    }
} = {}

interface IProps extends RouteComponentProps {
}

const RouterBread = (props: IProps) => {
    const { location } = props;
    const pathSnippets = location.pathname.split('/').filter((i: any) => i);
    const extraBreadcrumbItems = pathSnippets.slice(0, -1).map((item: any, index: number) => {
        const url = `/${pathSnippets.slice(0, index + 1).join('/')}`;
        return (
            <Breadcrumb.Item key={url}>
                <span>通用 / </span>
                {
                    breadcrumbNameMap[url].hasChild ? (
                        <span>{breadcrumbNameMap[url].label}</span>
                    ) : (
                            <Link to={url}>{breadcrumbNameMap[url].label}</Link>
                        )
                }
            </Breadcrumb.Item>
        );
    });
    // const breadcrumbItems = [
    //     <Breadcrumb.Item key="home">
    //         <span>账本</span>
    //     </Breadcrumb.Item>,
    // ].concat(extraBreadcrumbItems);
    const breadcrumbItems = extraBreadcrumbItems

    return (
        <Breadcrumb className="router-creadcrumb">{breadcrumbItems}</Breadcrumb>
    )
}

export default withRouter(RouterBread)
